class draft{
	constructor(e){
		this.ele = document.querySelector(e);
		this.move()
	}
	move(){
		let _this = this;
		this.ele.onmousedown = function(ev){
			var ev = ev||event;
			_this.l = ev.clientX - _this.ele.offsetLeft;
			_this.t = ev.clientY - _this.ele.offsetTop;
			_this.mouseDown();	
//			alert(1)
		}
		return false;
	}
	mouseDown(){
		let _this = this;
		this.ele.onmousemove = function(ev){
//			alert(1)
			var ev = ev||event;
			_this.dl = ev.clientX - _this.l;
			_this.dt = ev.clientY - _this.t;
			_this.ele.style.left = _this.dl+'px';
			_this.ele.style.top = _this.dt+'px';
		}
		this.mouseUp();
	}
	mouseUp(){
		let _this = this;
		document.onmouseup = function(){
			_this.ele.onmousemove = null;
			_this.ele.onmouseup = null
		}
		
	}
}

window.onload = function(){
	new draft('div')
}
